<div class="infoBlock infoBlockM">
<div class="infoBlockHeading"><span class="t">{$SETTINGS.bs_company}</span></div>
<div class="infoBlockContent">

{literal}
<style type="text/css">
.gimaged {
	display: table;
	width: 660px;
	height: 480px;
	margin: 10px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
}
.gimaged:hover {
	background-color: #E3E1BF;
}
div.gimgs {
	clear: both;
	float: left;
	display: block;
	margin-top: 20px;
	padding-top: 0px;
	list-style: none;
	width: 680px;
	height: 120px;
	line-height: 140px;
	text-align: center;
	vertical-align: middle;
	overflow: hidden;
	border: 1px solid #AAAAAA;
}
div.gimgs div.item {
	width: 100px;
	height: 80px;
	line-height: 80px;
	margin: 0px;
	vertical-align: middle;
}
div.gimgs div.item img {
	vertical-align: middle;
}
div.gimgs div.item-current {
	width: 120px;
	height: 100px;
	line-height: 100px;
	margin: 10px;
	background-color: #976d33;
}
div.gimgs div.item-current img {
	vertical-align: middle;
}
div.gimgs div.item-selected {
	width: 120px;
	height: 100px;
	line-height: 100px;
	margin: 10px 0px;
}
div.gimgs div.item-selected img {
	vertical-align: middle;
}
div.gimgs div.item-over {
	background-color: #976d33;
}
div.gnav {
	padding-right: 20px;
}
div.gnav a {
	margin: 4px;
}
</style>
{/literal}

{*
{literal}
<!--[if IE]>
<style type="text/css">
div.gimaged {
	line-height: 480px;
}
</style>
<![endif]-->
{/literal}
*}

{literal}
<script type="text/javascript" language="javascript">
var image_select = function(){};
var image_over = function(){};
var image_out = function(){};
</script>
{/literal}

<div class="infoBlockItem">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="gimaged" id="gimaged" onclick="image_next()">
  <tr>
    <td>
<a href="javascript:void(0);">
{if $CONTENT.item.id > 0}
{pp_pimage src=$CONTENT.item.value eid=$CONTENT.item.id url=$CONTEXT.URLBASE path_prefix="===CONFIG_DIR_UPLOADS_RESIZED" id="gimage"}
{else}
{pp_pimage src="blank.jpg" eid=$CONTENT.item.id url=$CONTEXT.URLBASE path_prefix="images/" id="gimage"}
{/if}
</a>
    </td>
  </tr>
</table>
</div>

<div class="infoBlockItem">
<div class="gimgs" id="glist">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
{section name=item loop=$CONTENT.items}
    <td>
<div class="item {if $CONTENT.item.id == $CONTENT.items[item].id}item-selected{/if}" id="gitem_{$CONTENT.items[item].id}" kid="{$smarty.section.item.index+1}" onmouseover="image_over(this)" onmouseout="image_out(this)">
<div class="gimg"><a href="{$CONTEXT.URL}gallery/{$CONTENT.items[item].id}{$CONTEXT.URL_SUFFIX}" onclick="image_select('{$CONTENT.items[item].id}');return false;">{pp_pimage src=$CONTENT.items[item].value eid=$CONTENT.items[item].id url=$CONTEXT.URLBASE path_prefix="===CONFIG_DIR_UPLOADS_THUMBS" width=$CONTENT.items[item].width height=$CONTENT.items[item].height lw="90" lh="60"}</a></div>
<div class="name hidden"></div>
<div class="desc hidden"></div>
</div>
    </td>
{/section}
  </tr>
</table>
</div>
<div class="right" id="gtxt"></div>
<div class="right gnav" id="gnav"></div>
</div>

</div>
</div>

<script type="text/javascript" language="javascript">
var slider_ct = null;
var slider_c = {if $CONTENT.item.id > 0}{$CONTENT.item.id}{else}0{/if};
var slider = null;
{literal}
function image_select(eid) {
	document.location.hash = eid;
	slider.click(eid);
	if( slider_c > 0 && slider_ct ) {
		slider_ct.className = "item";
	}
	slider_c = eid;
	slider_ct = $E("gitem_"+eid);
	slider_ct.className = "item-current";
	return false;
}
function image_over(obj) {
	daddClass(obj, "item-over");
}
function image_out(obj) {
	dremoveClass(obj, "item-over");
}
function image_current(){
	var eid = parseInt(document.location.hash.substring(1));
	if( eid > 0 ) {
		image_select(eid);
	}
}
function image_next(){
	if( slider_c > 0 ) {
		var eid = slider._psnext(slider_c);
		image_select(eid);
	}
}
//
slider = new slider_image("glist", "gimage");
slider.init();
//
addLoadEvent(function(){
	image_current();
});
</script>
{/literal}
